// tailwind 实现
import "./style.css";
// 原 css 实现
// import "./originStyle.css";

const app = document.querySelector("#app") as HTMLDivElement;

for (const btn of app?.children) {
    const textELs = [...(btn.textContent as string).trim()].map((char, index) => {
        if (char === " ") return "\u0020";
        return `<span style="--i: ${index}" class="inline-block animate-[floatDown_0.3s_calc(var(--i)*50ms)_ease] group-hover:animate-[floatUp_0.3s_ease_calc(var(--i)*50ms)_forwards]">${char}</span>`;
    });
    btn.innerHTML = textELs.join("");
}
